
const handler={
    get(target,prop){
        console.log("劫持get()",prop);
        return Reflect.get(target,prop)
    },
    set(target,prop,val){
        console.log("劫持set()",prop,val);
        return Reflect.set(target,prop,val)
    },
    deleteProperty(target,prop){
        console.log("劫持delete",prop);
        return Reflect.deleteProperty(target,prop)
    }
}


function reactive (target){

    // 他是深响应的数据，如果他的值是对象，还应该执行一下代理对象
    if(target &&  typeof target === "object"){
            Object.entries(target).forEach(([key,value])=>{
                if(typeof value === 'object'){
                    target[key] = reactive(value)
                }
            })
    }

    return new Proxy(target,handler)
}

const state = reactive({
    a:1,
    b:2,
    c:{
        d:3
    }
})

// 浅响应
function shallowReactive (target){
    return new Proxy(target,handler)
}
// 只能劫持到第一层
const state2 = shallowReactive({
    a:1,
    b:2,
    c:{
        d:3
    }
})